function $(id) {return document.getElementById(id)}
window.onload = function () {
    $("ipt1").addEventListener("click", function () {
        $("div1").className = "xian";
        $("div2").className = "yin";
        $("div4").className="yin";
        $("a1").style.backgroundColor="dimgrey";
        $("a2").style.backgroundColor="grey";
    });
    $("ipt2").addEventListener("click", function () {
        $("div2").className = "xian";
        $("div1").className = "yin";
        $("div3").className ="yin";
        $("a2").style.backgroundColor="dimgrey";
        $("a1").style.backgroundColor="grey";
    });
    $("but1").addEventListener("click",function () {
        if($("div1").className =="xian"){
            $("div3").className="xian";
            $("div4").className="yin";
        }
        else{
            $("div4").className="xian";
            $("div3").className="yin";
        }
    });
    $("but2").addEventListener("click",function () {
        $("div3").className="yin";
        $("div4").className="yin";
    })
}